//弹出层
.popUpBoxShadow(){
	box-shadow: 0px 4px 7px 0px rgba(48, 186, 120, 0.1);
}
.popUpBox {
	@toperHeight:40px;
	@footerHeight:55px;
	@submitBtnColWidth:140px;
	@box-borderRadius: 4px;
	@dividingLine:1px solid #ebedf7;
	position: fixed;
	z-index: 9999;
	.popUpBoxBg {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-image: url(../images/modules/bg_gray_alpha50.png);
	}
	.popUpBoxFg {
		position: relative;
		padding-bottom: @footerHeight;
		//box-sizing: content-box;
		//padding: 0px;
		background-color: #fff;
		//border:0;
		border-radius: @box-borderRadius;
		//box-shadow: 4px 4px 4px rgba(0, 0, 0, .3);
		.popUpBoxShadow();
		.close {
			position: absolute;
			display: block;
			width: 30px;
			height: 30px;
			right: 3px;
			top: 3px;
			padding: 0;
			margin: 0;
			border: 0;
			background-color: transparent;

			color: #777;
			text-align: center;
			font-size: 30px;
			line-height: 30px;

			cursor: pointer;

			&:hover:before {
				color: #333;
			}
			&:hover{
				color: #ccc;
			}
		}
		.popUpBoxTitle,
		.popUpBoxContent,
		.submitBtnBox {
			background-color: #fff;
			//margin: 0;
		}
		.popUpBoxTitle {
			height: @toperHeight;
			padding: 0 0 0 @toperHeight/2;
			//background-color: #fafafa;
			border-radius: @box-borderRadius @box-borderRadius 0 0;
			//border-color: #343544;
			//border-bottom: 0;

			font-size: 14px;
			line-height: @toperHeight;
			color: #333;
			//text-align: left;
		}
		.popUpBoxContent {
			//border-top: @dividingLine;
			//border-bottom: 0;
			//border-radius: 0;
			.shortCenterText {
				padding: @toperHeight @toperHeight/4;
				text-align: center;
			}
		}
		.submitBtnBox {
			position: absolute;
			width: 100%;
			height: @footerHeight;
			left: 0;
			bottom: 0;
			padding: 10px;
			margin: 0;
			border-radius: 0 0 @box-borderRadius @box-borderRadius;
			//border-top: @dividingLine;
			text-align: right;
			.col {
				display: inline-block;
				padding: 0px 6px;
			}
			&.alert {
				text-align: center;
			}
			&.confirm {
				text-align: right;
			}
			.btn {
				display: inline-block;
				min-width: 126px;
				&.btn-default{
					border-color: transparent;
				}
			}
		}
		.bubbleArrow {
			position: absolute;
			display: none;
			z-index: 1;
			background-repeat: no-repeat;
//			background-image: url(../images/modules/icon_menu_arrow_white.png);
//			&:before {
//				content: '';
//				position: absolute;
//				display: block;
//				background-color: #fff;
//			}
			&.top {
				display: block;
				width: 0px;
				height: 0px;
				top: -7px;
				left: 0;
				//background-color: @text-color-primary;
				border-top: 0;
				border-left: 5px solid transparent;
				border-right: 5px solid transparent;
				border-bottom: 6px solid @text-color-primary;
				&:before {
					height: 1px;
					width: 36%;
					left: 32%;
					bottom: -1px;
				}
			}
			&.bottom {
				display: block;
				width: 30px;
				height: 12px;
				bottom: -12px;
				left: 0;
				background-position: left bottom;
				&:before {
					height: 1px;
					width: 36%;
					left: 32%;
					top: -1px;
				}
			}
		}
	}

	&.transparent{
		.popUpBoxBg {
			background-color: transparent;
			background-image: none;
		}
		.popUpBoxFg {
			background-color: transparent;
			box-shadow: none;
			.popUpBoxTitle,
			.popUpBoxContent,
			.submitBtnBox{
				background-color: transparent;
				box-shadow: none;
				border: 0;
			}
		}
	}
	&.textContent{
		.popUpBoxFg {
			.popUpBoxContent{
				padding: 20px 30px;
			}
		}
	}
	&.fgTransparent,
	&.wait {
		.popUpBoxFg {
			background-color: transparent;
			box-shadow: none;
			.popUpBoxTitle,
			.popUpBoxContent,
			.submitBtnBox{
				background-color: transparent;
				border: 0;
			}
		}
	}
	&.bgTransparent{
		.popUpBoxBg {
			background-color: transparent;
			background-image: none;
		}
	}
	&.dom{
		.popUpBoxFg{
			.popUpBoxContent{
				//position: absolute;
				//padding-top: @toperHeight;
				//position: relative;
				//padding-bottom: @footerHeight;
			}
		}
	}
	&.contentScroll{
		.popUpBoxFg {
			.popUpBoxContent {
				position: absolute;
				overflow: auto;
				width: 100%;
				left: 0;
				top: @toperHeight;
				bottom: @footerHeight;
			}
		}
	}
	&.iframe,
	&.autoResize {
		.popUpBoxFg {
			.popUpBoxContent {
				position: absolute;
				width: 100%;
				left: 0;
				top: @toperHeight;
				bottom: @footerHeight;
			}
		}
	}
	&.alert{
		.popUpBoxFg{
			.popUpBoxContent{
				min-width: @submitBtnColWidth+20px;
			}
		}
	}
	&.confirm{
		.popUpBoxFg{
			.popUpBoxContent{
				min-width: @submitBtnColWidth*2+20px;
			}
		}
	}
	&.noCloseBtn{
		.popUpBoxFg {
			.close{
				display: none;
			}
		}
	}
	&.noTitleBar{
		.popUpBoxFg {
			.popUpBoxTitle{
				display: none;
			}
			.popUpBoxContent{
				border-top: 0;
			}
		}
	}
	&.noSubmitBtn{
		.popUpBoxFg {
			padding-bottom: 0;
			.submitBtnBox{
				display: none;
			}
		}
	}
	&.tips {
		.popUpBoxFg {
			background-image: url(../images/modules/bg_black_alpha50.png);
			background-color: transparent;
			padding: 0;
			.popUpBoxContent {
				padding:10px 20px;
				color: #fff;
				background-color: transparent;
				border-radius: @box-borderRadius;
			}
		}
	}
	&.wait{
		.popUpBoxFg {
			.popUpBoxContent {
				min-width: 230px;
				padding: 20px;
				padding-top: 150px;
				background-color: transparent;
				background-image: url(../images/loading.gif);
				background-repeat: no-repeat;
				background-position: center top;
				text-align: center;
				color: #fff;
			}
		}
	}
	&.textTips{
		.popUpBoxFg{
			background-color: transparent;
			box-shadow: none;
			.popUpBoxContent{
			}
		}
	}

	&.bubble,
	&.menu {
		border: 0;
		//width: 0;
		//height: 0;
		.popUpBoxFg {
			position: relative;
			padding: 0;
			left: 0;
			top: 0;
			background-color: transparent;
			border: 0;
			.popUpBoxContent {
				position: relative;
				overflow: auto;
				max-height: 240px;
				padding: 0;
				background-color: #fbfbfb;
				border-radius: 3px;
				.menuBtnBox {
					padding: 0;
					//border: 1px solid #eee;
					border-radius: 3px;
					box-shadow: 0px 3px 5px rgba(0, 0, 0, .4);
					overflow: hidden;
					.menuBtn {
						padding: 8px;
						cursor: default;
						border-top: 1px solid #eee;
						white-space: nowrap;
						&:first-child {
							border-top-width: 0px;
						}
						&:hover {
							background-position: 7px center;
						}
					}
				}
				.menuTipsBox {
					padding: 0;
					//border: 1px solid #eee;
					border-radius: 3px;
					box-shadow: 0px 3px 5px rgba(0, 0, 0, .4);
					overflow: hidden;
					.menuTips {
						padding: 8px 16px 8px 16px;
						cursor: default;
						white-space: nowrap;
					}
				}
			}
		}

		//颜色设定
		//白色
		.popUpBoxFg {
			.popUpBoxContent {
				border: 1px solid #eee;
				.menuBtnBox {
					background-color: #fff;
					.menuBtn {
						color: #333;
						background-color: #fff;
						&:hover {
							background-color: #efefef;
							color: @text-color-primary;
						}

					}
				}
				.menuTipsBox {
					background-image: url(../images/modules/bg_black_alpha50.png);
					.menuTips {
						color: #fff;
					}
				}
			}
		}
		//半透明黑色
		&.black_alpha80 {
			.popUpBoxFg {
				.popUpBoxContent {
					.menuTipsBox {
						background-image: url(../images/modules/bg_black_alpha80.png);
						.menuTips {
							color: #fff;
						}
					}
				}
				.bubbleArrow {
					background-image: url(../images/modules/icon_menu_arrow_black_alpha80.png);
					&:before {
						background-image: url(../images/modules/bg_black_alpha80.png);
					}
				}
			}
		}
		//黑色
		&.black {
			.popUpBoxFg {
				.popUpBoxContent {
					border: 1px solid #61626a;
					.menuBtnBox {
						background-color: #52535b;
						.menuBtn {
							color: #fff;
							background-color: #52535b;
							border-top-color: #61626a;
							&:hover {
								background-color: #47484f;
							}

						}
					}
				}
				.bubbleArrow {
					background-image: url(../images/modules/icon_menu_arrow.png);
					&:before {
						background-color: #52535b;
					}
				}
			}
		}
	}
	&.bubble{
		.popUpBoxFg{
			border: 1px solid @text-color-primary;
		}
	}



	.hoverTipsBox{
		overflow: auto;
		position: relative;
		padding: 10px;
		max-width: 420px;
		max-height: 480px;
		background-color: #fbfbfb;
		border: 1px solid @text-color-primary;
		border-radius: 2px;
		left: 5px;
		top: -5px;
		font-size: 12px;
		.popUpBoxShadow();
		.hoverTipsTitle{
			position: relative;
			padding-left: 10px;
			margin-bottom: 2px;
			color: @text-color-primary;
			&:before{
				content:"";
				position: absolute;
				width: 6px;
				height: 6px;
				left: 0;
				top: 50%;
				margin-top: -3px;
				background-color: @text-color-primary;
				border-radius: 50%;
			}
		}
		.hoverTipsDescription{
			padding-left: 10px;
		}
		.hoverTipsContent{
			color: #b2bac2;
		}
	}
	&.selectDisabled{
		.user-select-none();
		input,textarea{
			.user-select-all()
		}
	}
}